<script setup>
import { computed } from 'vue'

const props = defineProps({
  as: String,
  class: String
})

const component = computed(() => props.as || 'div')
const componentClass = computed(() => [
  'group relative flex flex-col items-start',
  props.class
].filter(Boolean))
</script>

<template>
  <component :is="component" :class="componentClass">
    <slot />
  </component>
</template>

<script>
export default {
  name: 'Card'
}
</script>
